<template>
  <div>
    <van-config-provider :theme-vars="themeVars">
      <van-nav-bar
        :title="route.meta.name as string | undefined"
        :left-text=leftText
        right-text="按钮"
        :left-arrow = isSHowBack
        @click-left="onClickLeft"
        @click-right="onClickRight"
      />
    </van-config-provider>
    
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, watch } from 'vue';
import { useRoute } from 'vue-router';
import { showToast } from 'vant';
// defineProps<{
//   title: string
// }>()
let isSHowBack = ref(false)
const leftText = ref('')

const route = useRoute()
watch(  
  () => route,  
  (newRoute) => {  
    if(newRoute.path == '/home'){
      isSHowBack.value = false
      leftText.value = ''
    }else{
      isSHowBack.value = true
      leftText.value = '返回'
    }
  },  
  { deep: true }
);
//导航栏主题
const themeVars = reactive({
  
});

const onClickLeft = ():void => history.back();
const onClickRight = () => showToast('按钮');

</script>

<style lang="less" scoped>

</style>